<template>
	<div>
		<divider class="m_top50">极速征信，{{txt}}</divider>
		<div style="width:85%;text-align:center;margin: 0 auto;">
			<el-steps :active="active" simple finish-status="success">
				<el-step style="width:33%;" title="基本信息"></el-step>
				<el-step style="width:33%;" title="证件信息"></el-step>
				<el-step style="width:auto;" title="上传证件"></el-step>
			</el-steps>
		</div>
        <!-- 基本信息 -->
        <div v-show="basicInformation">
            <!-- 工作情况 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="jobCase">
                <x-icon type="ios-plus-empty" size="30" @click="going(1)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 工作情况 model-->
            <div v-transfer-dom>
                <x-dialog v-model="showJob" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="color:#fff;text-align:center;">
                        <span style="font-size:18px;margin:0px auto 50px;">选择您的职业形式</span>
                        <br>
                        <div style="width:70%;margin:50px auto 20px;">
                            <grid>
                                <div class="weui-grid" style="width:50%;height:115px;padding:30px;color:#fff;border-radius: 10px;" :class="choose==1?'yes':''" @click="job(1,'上班族','job')">
                                    <i class="iconfont icon-gongwenbao" style="font-size:30px;"></i>
                                    <p>上班族</p>
                                    <icon type="success-no-circle" v-show="choose == 1"></icon>
                                </div>
                                <div class="weui-grid" style="width:50%;height:115px;padding:30px;color:#fff;border-radius: 10px;" :class="choose==2?'yes':''" @click="job(2,'企业主','job')">
                                    <i class="iconfont icon-web-icon-" style="font-size:30px;"></i>
                                    <p>企业主</p>
                                    <icon type="success-no-circle" v-show="choose == 2"></icon>
                                </div>
                            </grid>
                            <grid>
                                <div class="weui-grid" style="width:50%;height:115px;padding:30px;color:#fff;border-radius: 10px;" :class="choose==3?'yes':''" @click="job(3,'个体户','job')">
                                    <i class="iconfont icon-getihu" style="font-size:30px;"></i>
                                    <p>个体户</p>
                                    <icon type="success-no-circle" v-show="choose == 3"></icon>
                                </div>
                                <div class="weui-grid" style="width:50%;height:115px;padding:30px;color:#fff;border-radius: 10px;" :class="choose==4?'yes':''" @click="job(4,'自由职业者','job')">
                                    <i class="iconfont icon-shangban" style="font-size:30px;"></i>
                                    <p>自由职业者</p>
                                    <icon type="success-no-circle" v-show="choose == 4"></icon>
                                </div>
                            </grid>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(1)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(1)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 教育水平 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="educational">
                <x-icon type="ios-plus-empty" size="30" @click="going(2)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 教育水平 model -->
            <div v-transfer-dom>
                <x-dialog v-model="showEducation" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="text-align:center;">
                        <span style="color:#fff;font-size:18px;margin:0px auto 50px;">选择您的教育水平</span>
                        <br>
                        <div style="width:80%;margin:50px auto 20px;" class="">
                            <group class="">
                                <radio class="" :options="radio1" @on-change="change1" v-model="radio1Value" style="border-radius: 10px;"></radio>
                            </group>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(2)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(2)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 住房情况 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="houseCase">
                <x-icon type="ios-plus-empty" size="30" @click="going(3)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 住房情况 model -->
            <div v-transfer-dom>
                <x-dialog v-model="showHouse" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="color:#fff;text-align:center;">
                        <span style="font-size:18px;margin:0px auto 50px;">住房情况</span>
                        <br>
                        <div style="width:70%;margin:30% auto 30%;">
                            <!-- <group-title>2 columns</group-title> -->
                            <grid>
                                <div class="weui-grid" style="width:50%;height:105px;padding:20px;color:#fff;border-radius: 10px;" :class="choose==1?'yes':''" @click="job(1,'租赁','house')">
                                    <i class="iconfont icon-zulinwuguanli" style="font-size:30px;"></i>
                                    <p>租赁</p>
                                    <icon type="success-no-circle" v-show="choose == 1"></icon>
                                </div>
                                <div class="weui-grid" style="width:50%;height:105px;padding:20px;color:#fff;border-radius: 10px;" :class="choose==2?'yes':''" @click="job(2,'自由','house')">
                                    <i class="iconfont icon-moban" style="font-size:30px;"></i>
                                    <p>自由</p>
                                    <icon type="success-no-circle" v-show="choose == 2"></icon>
                                </div>
                            </grid>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(3)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(3)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 信用卡 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="creditCard">
                <x-icon type="ios-plus-empty" size="30" @click="going(4)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 信用卡 model -->
            <div v-transfer-dom>
                <x-dialog v-model="showCreditCard" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="text-align:center;">
                        <span style="color:#fff;font-size:18px;margin:0px auto 50px;">信用卡使用情况</span>
                        <br>
                        <div style="width:80%;margin:50px auto 20px;" class="border_radius">
                            <group style="border-radius:10px;">
                                <radio :options="radio2" @on-change="change2" v-model="radio2Value"></radio>
                            </group>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(4)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(4)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 婚姻状况 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="marriageCase">
                <x-icon type="ios-plus-empty" size="30" @click="going(5)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 婚姻状况 model -->
            <div v-transfer-dom>
                <x-dialog v-model="showMarriage" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="text-align:center;">
                        <span style="color:#fff;font-size:18px;margin:0px auto 50px;">婚姻状况</span>
                        <br>
                        <div style="width:80%;margin:50px auto 20px;" class="border_radius">
                            <group style="border-radius:10px;">
                                <radio :options="radio3" @on-change="change3" v-model="radio3Value"></radio>
                            </group>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(5)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(5)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 社保公积金状况 -->
             <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="accumulationFundCase">
                <x-icon type="ios-plus-empty" size="30" @click="going(6)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 社保公积金 model -->
             <div v-transfer-dom>
                <x-dialog v-model="showAccumulationFund" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="text-align:center;">
                        <span style="color:#fff;font-size:18px;margin:0px auto 50px;">是否有本地社保/公积金?</span>
                        <br>
                        <div style="width:70%;margin:40% auto 40%;">
                            <!-- <group-title>2 columns</group-title> -->
                                <flexbox>
                                    <flexbox-item>
                                        <x-button type="default" :class="choose==1?'yes2':''" @click.native="job(1,'没有','accumulationFund')">没有</x-button>
                                    </flexbox-item>
                                    <flexbox-item>
                                        <x-button type="default" :class="choose==2?'yes2':''" @click.native="job(2,'有','accumulationFund')">有</x-button>
                                    </flexbox-item>
                                </flexbox>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(6)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(6)"></x-icon>
                    </div>
                </x-dialog>
            </div>
            <!-- 收入范围 -->
            <div style="position:relative;width:80%;margin:20px auto;">
                <input class="weui-btn weui-btn_default" style="font-size:14px;" type="button" v-model="incomeCase">
                <x-icon type="ios-plus-empty" size="30" @click="going(7)" style="position:absolute;top:50%;margin-top:-15px;right:30px;"></x-icon>
            </div>
            <!-- 收入范围 model -->
            <div v-transfer-dom>
                <x-dialog v-model="showIncome" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '80%', 'background-color': 'transparent'}">
                    <div style="text-align:center;">
                        <span style="color:#fff;font-size:18px;margin:0px auto 50px;">请选择您的收入范围</span>
                        <br>
                        <div style="width:80%;margin:50px auto 20px;" class="border_radius">
                            <group style="border-radius:10px;">
                                <radio :options="radio4" @on-change="change4" v-model="radio4Value"></radio>
                            </group>
                        </div>
                        <br>
                        <x-button class="yes3" type="default" style="width:50%;margin:20px auto;" @click.native="save(7)">保存</x-button>
                        <x-icon type="ios-close-outline" style="fill:#fff;width: 50px;height: 50px;" @click="hideDialog(7)"></x-icon>
                    </div>
                </x-dialog>
            </div>
        </div>
        <!-- 第二步 -->
        <div v-show="creditInformation">
            第二步
        </div>
        <!-- 第三步 -->
        <div v-show="UploadPapers">
          <!-- 正面 -->
            <div class="admin" style="margin:20px auto 0px;border:1px dashed #ccc;width:70%;overflow:hidden;border-radius:10px;">
                <div class="admin_left" style="float:left;width:60%;height:100%;position:relative;">
                    <div v-show="imgi1">
                        <!-- <i class="iconfont icon-shenfenzhengzhengmian" style="color:#9296A6;font-size:100px;width:100px;height:60%;"></i> -->
                        <img src="../../image/身份证正面.png" alt="" style="width:100px;height:100px;">
                        <p style="height:40%;color:#ccc;">身份证正面</p>
                        <p @click="setAvatar('idcardFront')" style="position:absolute;top:35%;left:50%;margin-left:-30px;width:60px;height:25px;line-height:25px;background-color:rgba(0,0,0,0.5);color:#fff;border-radius:20px;">上传</p>
                    </div>
                    <img :src="avatar1" style="width:100px;height:104px;" v-show="img1">
                </div>
                <div class="admin_right" style="float:right;width:40%;height:100%;">
                    <div class="img" style='height:100%'>
                        <x-icon type="ios-plus-empty" size="100" @click="setAvatar('idcardFront')" style="fill:#ccc;"></x-icon>
                    </div>
                    <input type="file" name="avatar" accept="image/jpeg,image/jpg,image/png" style="display:none" value="上传文件" @change="changeImage($event,'front')" ref="idcardFrontInput" >
                </div>
            </div>

            <!-- 反面 -->
             <div class="admin" style="margin:20px auto 0px;border:1px dashed #ccc;width:70%;overflow:hidden;border-radius:10px;">
                <div class="admin_left" style="float:left;width:60%;height:100%;position:relative;">
                    <div v-show="imgi2">
                        <!-- <i class="iconfont icon-shenfenzhengzhengmian" style="color:#9296A6;font-size:100px;width:100px;height:60%;"></i> -->
                        <img src="../../image/身份证反面.png" alt="" style="width:100px;height:100px;">
                        <p style="height:40%;color:#ccc;">身份证反面</p>
                        <p @click="setAvatar('idcardBack')" style="position:absolute;top:35%;left:50%;margin-left:-30px;width:60px;height:25px;line-height:25px;background-color:rgba(0,0,0,0.5);color:#fff;border-radius:20px;">上传</p>
                    </div>
                    <img :src="avatar2" style="width:100px;height:104px;" v-show="img2">
                </div>
                <div class="admin_right" style="float:right;width:40%;height:100%;">
                    <div class="img" style='height:100%'>
                        <x-icon type="ios-plus-empty" size="100" @click="setAvatar('idcardBack')" style="fill:#ccc;"></x-icon>
                    </div>
                    <input type="file" name="avatar" accept="image/jpeg,image/jpg,image/png" style="display:none" value="上传文件" @change="changeImage($event,'back')" ref="idcardBackInput" >
                </div>
            </div>
            <!-- 手持 -->
             <div class="admin" style="margin:20px auto 0px;border:1px dashed #ccc;width:70%;overflow:hidden;border-radius:10px;">
                <div class="admin_left" style="float:left;width:60%;height:100%;position:relative;">
                    <div v-show="imgi3">
                        <!-- <i class="iconfont icon-shenfenzhengzhengmian" style="color:#9296A6;font-size:100px;width:100px;height:60%;"></i> -->
                        <img src="../../image/手持身份证.png" alt="" style="width:100px;height:100px;">
                        <p style="height:40%;color:#ccc;">手持身份证</p>
                        <p @click="setAvatar('idcardHand')" style="position:absolute;top:35%;left:50%;margin-left:-30px;width:60px;height:25px;line-height:25px;background-color:rgba(0,0,0,0.5);color:#fff;border-radius:20px;">上传</p>
                    </div>
                    <img :src="avatar3" style="width:100px;height:104px;" v-show="img3">
                </div>
                <div class="admin_right" style="float:right;width:40%;height:100%;">
                    <div class="img" style='height:100%'>
                        <x-icon type="ios-plus-empty" size="100" @click="setAvatar('idcardHand')" style="fill:#ccc;"></x-icon>
                    </div>
                    <input type="file" name="avatar" accept="image/jpeg,image/jpg,image/png" style="display:none" value="上传文件" @change="changeImage($event,'hand')" ref="idcardHandInput" >
                </div>
            </div>
        </div>
        <!-- 按钮 -->
        <div>
            <x-button v-show="!finish" class="yes3" type="default" style="float:left;margin:30px 0px 30px 20px;width:40%;" @click.native="last">上一步</x-button>
            <x-button v-show="!finish" class="yes3" type="default" style="float:right;margin:30px 20px 30px 0px;width:40%;" @click.native="next">{{nextnext}}</x-button>
            <x-button v-show="finish" class="yes3" type="default" style="margin:30px auto 30px;width:70%;" @click.native="submit">{{submitFinish}}</x-button>
        </div>
        <div style="height:5px;width:100%;"></div>
	</div>
</template>
<script>
import {
  Divider,
  XButton,
  TransferDomDirective as TransferDom,
  XDialog,
  Grid,
  GridItem,
  Radio,
  Group,
  Icon,
  Flexbox,
  FlexboxItem
} from "vux";
export default {
  directives: {
    TransferDom
  },
  components: {
    Divider,
    XButton,
    XDialog,
    Grid,
    GridItem,
    Radio,
    Group,
    Icon,
    Flexbox,
    FlexboxItem
  },
  data() {
    return {
      txt: "只需三步",
      // 基本信息
      basicInformation: true,
      //   征信信息
      creditInformation: false,
      //   上传证件
      UploadPapers: false,
      nextnext: "下一步",
      submitFinish: "提交完成",
      finish: false,
      radio1: [
        "初中及以下",
        "高中/技校/中专",
        "大专",
        "本科",
        "硕士及硕士以上"
      ],
      radio1Value: "初中及以下",
      radio2: ["正常", "冻结", "止付", "挂失", "收卡", "作废"],
      radio2Value: "正常",
      radio3: ["未婚", "已婚", "离婚", "丧偶"],
      radio3Value: "未婚",
      radio4: [
        "3000以下",
        "3000元-6000元",
        "6000元-10000元",
        "10000元-15000元",
        "15000元-30000元",
        "30000元以上"
      ],
      radio4Value: "3000以下",
      active: 0,
      choose: 1,
      //传参数
      jobCase: "请选择工作情况",
      educational: "请选择教育水平",
      houseCase: "请选择住房情况",
      creditCard: "信用卡信用状况",
      marriageCase: "请选择婚姻状况",
      incomeCase: "请选择收入范围",
      accumulationFundCase: "请选择社保/公积金",
      //传参数 end
      showJob: false,
      showEducation: false,
      showHouse: false,
      showCreditCard: false,
      showMarriage: false,
      showAccumulationFund: false,
      showIncome: false,
      jobCase1: "上班族",
      educational1: "初中及以下",
      houseCase1: "租赁",
      creditCard1: "正常",
      marriage1: "未婚",
      incomeCase1: "3000元以下",
      accumulationFundCase1: "没有",
      /** 第二步 */
      imgNum: 4,
      avatar1: "",
      avatar2: "",
      avatar3: "",
      img1: false,
      imgi1: true,
      img2: false,
      imgi2: true,
      img3: false,
      imgi3: true
    };
  },
  methods: {
    //   提示
    successHint() {
      this.$message({
        showClose: true,
        message: "上传成功",
        type: "success",
        duration: "3000"
      });
    },
    error1Hint() {
      this.$message({
        showClose: true,
        message: "提示：图片只支持jpg,png,jpeg格式!",
        type: "warning",
        duration: "4000"
      });
    },
    error2Hint() {
      this.$message({
        showClose: true,
        message: "提示：请上传未上传的文件!",
        type: "warning",
        duration: "5000"
      });
    },
    error3Hint() {
      this.$message({
        showClose: true,
        message: "提示：请上传小于3M的图片!",
        type: "warning",
        duration: "5000"
      });
    },
    // 上传
    submit() {
      if (
        this.$refs.idcardFrontInput.files.length !== 0 &&
        this.$refs.idcardBackInput.files.length !== 0 &&
        this.$refs.idcardHandInput.files.length !== 0
      ) {
      } else {
        this.error2Hint();
        return;
      }
      var image = new FormData();
      image.append("avatar1", this.$refs.idcardFrontInput.files[0]);
      image.append("avatar2", this.$refs.idcardBackInput.files[0]);
      image.append("avatar3", this.$refs.idcardHandInput.files[0]);
      console.log(image);
      $.ajax({
        url: this.$store.state.url + "/real/realNameCompany",
        type: "POST",
        data: image,
        async: true,
        processData: false,
        contentType: false,
        success: function(data) {
          console.log(data);
        }
      });
    },
    // 点击对应input
    setAvatar(cs) {
      if (cs == "idcardFront") {
        this.$refs.idcardFrontInput.click();
      } else if (cs == "idcardBack") {
        this.$refs.idcardBackInput.click();
      } else if (cs == "idcardHand") {
        this.$refs.idcardHandInput.click();
      }
    },
    //  上传图片
    changeImage(e, other) {
      var file = e.target.files[0];
      var reader = new FileReader();
      var that = this;
      reader.readAsDataURL(file);
      reader.onload = function(e) {
        // 上传图片格式 只支持 jpg，png，jpeg
        var testmsg = file.name.substring(file.name.lastIndexOf(".") + 1);
        const extension = testmsg === "jpg";
        const extension2 = testmsg === "png";
        const extension3 = testmsg === "jpeg";
        if (!extension && !extension2 && !extension3) {
          that.error1Hint();
          return;
        }
        //  限制上传图片大小3M
        var fileSize = 0;
        var fileMaxSize = 1024 * 3; //3M
        fileSize = file.size;
        var size = fileSize / 1024;
        if (size > fileMaxSize) {
          that.error3Hint();
        } else {
          that.successHint();
          //   正面
          if (other == "front") {
            that.avatar1 = this.result;
            that.img1 = true;
            that.imgi1 = false;
          } else if (other == "back") {
            //   反面
            that.img2 = true;
            that.imgi2 = false;
            that.avatar2 = this.result;
          } else if (other == "hand") {
            //   手持
            that.img3 = true;
            that.imgi3 = false;
            that.avatar3 = this.result;
          }
        }
      };
    },
    /*  第一步  */
    //教育水平
    change1(value) {
      this.educational1 = value;
    },
    // 信用卡
    change2(value) {
      this.creditCard1 = value;
    },
    // 婚姻
    change3(value) {
      this.marriage1 = value;
    },
    // 收入
    change4(value) {
      this.incomeCase1 = value;
    },
    // 上一步
    last() {
      if (this.active == 0) {
        this.active = 0;
        location.href = "#/operator";
      } else if (this.active == 1) {
        this.active--;
        this.basicInformation = true;
        this.creditInformation = false;
        this.UploadPapers = false;
        this.nextnext = "下一步";
        this.txt = "只需三步";
      } else if (this.active == 2) {
        this.active--;
        this.creditInformation = true;
        this.basicInformation = false;
        this.UploadPapers = false;
        this.nextnext = "下一步";
        this.txt = "第二步";
      }
    },
    // 下一步
    next() {
      if (this.active == 0) {
        this.active++;
        this.creditInformation = true;
        this.basicInformation = false;
        this.txt = "第二步";
      } else if (this.active == 1) {
        this.txt = "最后一步";
        this.active++;
        this.creditInformation = false;
        this.UploadPapers = true;
        this.nextnext = "完成";
        this.finish = true;
      }
    },
    // 打开弹框
    going(t) {
      if (t == 1) {
        this.showJob = true;
      } else if (t == 2) {
        this.showEducation = true;
      } else if (t == 3) {
        this.showHouse = true;
      } else if (t == 4) {
        this.showCreditCard = true;
      } else if (t == 5) {
        this.showMarriage = true;
      } else if (t == 6) {
        this.showAccumulationFund = true;
      } else if (t == 7) {
        this.showIncome = true;
      }
    },
    // 关闭弹框
    hideDialog(t) {
      if (t == 1) {
        this.showJob = false;
      } else if (t == 2) {
        this.showEducation = false;
      } else if (t == 3) {
        this.showHouse = false;
      } else if (t == 4) {
        this.showCreditCard = false;
      } else if (t == 5) {
        this.showMarriage = false;
      } else if (t == 6) {
        this.showAccumulationFund = false;
      } else if (t == 7) {
        this.showIncome = false;
      }
    },
    // 选择职业
    job(t, m, diff) {
      this.choose = t;
      if (diff == "job") {
        this.jobCase1 = m;
      } else if (diff == "house") {
        this.houseCase1 = m;
      } else if (diff == "accumulationFund") {
        console.log(t);
        this.accumulationFundCase1 = m;
      }
    },
    // 保存
    save(t) {
      if (t == 1) {
        this.jobCase = "职业：" + this.jobCase1;
        this.showJob = false;
      } else if (t == 2) {
        this.educational = "教育：" + this.educational1;
        this.showEducation = false;
      } else if (t == 3) {
        this.houseCase = "住房：" + this.houseCase1;
        this.showHouse = false;
      } else if (t == 4) {
        this.creditCard = "状态：" + this.creditCard1;
        this.showCreditCard = false;
      } else if (t == 5) {
        this.marriageCase = "状况：" + this.marriage1;
        this.showMarriage = false;
      } else if (t == 6) {
        this.accumulationFundCase =
          "社保/公积金：" + this.accumulationFundCase1;
        this.showAccumulationFund = false;
      } else if (t == 7) {
        this.incomeCase = "范围：" + this.incomeCase1;
        this.showIncome = false;
      }
    }
    /*  第二步  */
  },
  mounted() {
    document.title = "基本信息";
    console.log(this.active);
    console.log(this.$store.state.avatar);
  }
};
</script>
<style lang="less" scoped>
.btn_wrap {
  padding: 0 1rem;
  margin-top: 2rem;
}

.m_top50 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 16px;
}

.vux-step-item-with-tail {
  height: 70px;
}

.el-step__main {
  margin-left: -5px !important;
}

.vux-close {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  color: #999;
  width: 24px;
  height: 24px;
  &:before,
  &:after {
    content: "";
    position: absolute;
    left: 0;
    top: 11px;
    width: 24px;
    height: 1px;
    background-color: currentColor;
    transform: rotate(-45deg);
  }
  &:after {
    transform: rotate(45deg);
  }
}

.yes {
  color: #000 !important;
  background-color: #fff;
}
.yes2 {
  color: #fff;
  background-color: #1aad19;
}
.yes3 {
  color: #fff;
  background-color: #1f5aa0;
}
</style>
